<template>
	<div style="display: flex;align-items: center;margin-bottom: 20px;">
		<span style="margin-right: 10px;cursor: pointer;display: flex;align-items: center;" @click="back">
			<el-icon><ArrowLeft /></el-icon>
			<span>返回</span>
			<span style="margin-left: 10px;">|</span>
		</span>
		<h3>订单详情</h3>
	</div>
	<div class="myform">
		<div>
			<span class="characters">商品名称</span>
			<span class="record">{{myform.goods_name}}</span>
		</div>
		<div>
			<span class="characters">配送方式</span>
			<span class="record">{{myform.order_delivery_name}}</span>
		</div>
		<div>
			<span class="characters">订单编号</span>
			<span class="record">{{myform.order_notes}}</span>
		</div>
		<div>
			<span class="characters">订单来源</span>
			<span class="record">{{myform.order_source_name}}</span>
		</div>
		<div>
			<span class="characters">订单状态</span>
			<span class="record">{{myform.order_status_name}}</span>
		</div>
		<div>
			<span class="characters">订单id</span>
			<span class="record">{{myform.coupon_user_id}}</span>
		</div>
		<div>
			<span class="characters">订单价格</span>
			<span class="record">{{myform.price_value}}</span>
		</div>
		<div>
			<span class="characters">留言</span>
			<span class="record">{{myform.order_message}}</span>
		</div>
	</div>
</template>

<script setup>
	import {ArrowLeft} from '@element-plus/icons-vue'
	import {defineEmits,defineProps,reactive,ref} from "vue"
	import {CouponOrderList} from "@/api"
	
	// 返回
	const emit=defineEmits(['change-children'])
	const back=()=>{
		emit('change-children')
	}
	
	let myform=reactive({})
	const props=defineProps(["msgid"])
	// 列表
	const couponOrderList=async()=>{
		// console.log("couponid",props.msgid)
		let res=await CouponOrderList({
			couponUserId:props.msgid
		})
		Object.assign(myform,res[0])
		// console.log("订单详情",myform)
	}
	
	couponOrderList()
</script>

<style scoped>
	.myform{
		margin-top: 20px;
		.characters{
			display: inline-block;
			text-align: right;
			height: 30px;
			line-height: 30px;
			width: 140px;
		}
		.record{
			display: inline-block;
			padding-left: 10px;
			height: 30px;
			line-height: 30px;
		}
	}
</style>
